<template>
  <el-dialog
    :title="dialogTitle"
    v-model:visible="dialogVisible" 
    width="80%"
    center
    @close="handleClose">
    <template #content>
      <CustomList @close="handleClose" />
    </template>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="handleClose">取消</el-button>
        <el-button type="primary" @click="handleClose">确定</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script>
import CustomList from './CustomList.vue';

export default {
  components: {
    CustomList
  },
  data() {
    return {
      dialogVisible: false,
      dialogTitle: '自定义数据列表'
    }
  },
  methods: {
    open() {
      this.dialogVisible = true;
    },
    handleClose() {
      this.dialogVisible = false;
    }
  }
}
</script>